<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>博客列表</title>
    <link rel="stylesheet" href="css/conmmon.css">
    <link rel="stylesheet" href="css/blog_list.css?v=1">
    <script src="js/jquery.min.js"></script>
</head>

<body>
    <!-- 导航栏 -->
    <div class="nav">
        <img src="https://p.qqan.com/up/2020-5/2020052808383986122.jpg" alt="">
        <span class="title">我的博客系统</span>
        <!-- 用来占据中间位置 -->
        <span class="spacer"></span>
        <a href="index.html">主页</a>
        <a href="blog_add.html">写博客</a>
        <a id="islogin" href="javascript:logout()">退出</a>
        <!-- <a href="#">注销</a> -->
    </div>
    <!-- 版心 -->
    <div class="container">
        <!-- 左侧个人信息 -->
        <div class="container-left">
            <div class="card">
                <img src="img/doge.jpg" class="avtar" alt="">
                <h3 id="nickname"></h3>
                <a  href="https://gitee.com/login" target="_blank">gitee 地址</a>
                <div class="counter">
                    <span >文章</span>
               
                </div>
                <div class="counter">
                    <span id="acount"></span>
    
                </div>
            </div>
        </div>
        <!-- 右侧内容详情 -->
        <div id="artlist" class="container-right">
            <div id="unart" style="text-align:center;display:none;">
                <h3>当前用户未发表文章</h3>
            </div>
            <!-- 每一篇博客包含标题, 摘要, 时间 -->
            
        </div>
    </div>

    <script>
        var uid=0;
        //1.查询用户的信息
        function myUserInfo(){
            jQuery.ajax({
                url:"loginUserInfo",
                type:"GET",
                data:"",
                success:function(result){
                    if(result!=null && result.succ==200){
                        //前后端交互正常
                        if(result.data!=null && result.data.uid>0){
                            //登录成功
                            jQuery("#nickname").text(result.data.nickname);
            
                            uid=result.data.uid;
                            createArtList();
                            
                        }else{
                            alert("抱歉，请先登录！");
                            location.href="login.html";
                        }
                    }else{
                        alert("抱歉！后端程序不可用，请您稍后再试！");
                    }
                }
            });
        };
        myUserInfo();

        //2.得到用户的文章列表
        function createArtList(){
            jQuery.ajax({
            url:"myarticlelist",
            type:"GET",
            data:{"uid":uid},
            success:function(result){
                if(result!=null && result.succ==200){
                    var artlist=result.data;
                    if(artlist!=null && artlist.length>0){
                        jQuery("#acount").text(artlist.length);
                        //当前用户有发表文章
                        var artHtml='';
                        for(var i=0;i<artlist.length;i++){
                            var article=artlist[i];
                            artHtml+= '<div class="blog">'+
                                ' <div class="title">'+article.title+'</div>'+
                                '<div class="date">'+article.createtime+'</div>'+
                                ' <div class="desc">'+article.desc+'</div>'+
                                ' <div style="text-align: center;"> <a href="blog_content.html?id='
                                    +article.aid+'" class="detail2">查看全文 &gt;&gt;</a>&nbsp; &nbsp;<a href="blog_edit.html?aid='
                                    +article.aid+'" class="detail2" style="color: brown;"> 修 改 </a>&nbsp; &nbsp; <a href="javascript:del('
                                    +article.aid+');" class="detail2" style="color: red;"> 删 除 </a>&nbsp; &nbsp; </div></div><hr>';
                        }
                        jQuery("#artlist").html(artHtml);
                    }else{
                        //当前用户未发表文章
                        jQuery("#unart").show();
                    }
                }else{
                    alert("抱歉，后端程序不可用，请稍后再试！");
                }
            }
        });
     };
        //退出事件
         function logout(){
             if(confirm("是否退出？")){
                 //1.session清空
                 jQuery.ajax({
                     url:"loginout",
                     type:"POST",
                     success:function(result){
                         if(result!=null && result.succ==200 && result.data==1){
                             alert("退出成功！");
                             location.href="login.html";
                         }else{
                             alert("抱歉，操作出错，请重试！");
                         }
                     }
                 });

             }
         }


         //删除文章
         function del(aid){
             if(confirm("是否确认删除？")){
                 if(aid!=null && aid>0){
                     jQuery.ajax({
                         url:"delart",
                         type:"POST",
                         data:{"aid":aid},
                         success:function(result){
                             if(result!=null && result.succ==200 && result.data==1){
                                 alert("删除成功");
                                 location.href=location.href;
                             }else{
                                 alert("抱歉，操作失败，请重试！");

                             }
                         }
                     });
                 }
             }
         }
    </script>
</body>

</html>